<!DOCTYPE html> 
<?php
include './lib/info_logado.php';
?>
<html>

    <head>
        <title>AFACT - <?= $nome ?></title>
        <meta name="description" content="website description" />
        <meta name="keywords" content="website keywords, website keywords" />
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
        <!-- modernizr enables HTML5 elements and feature detects -->
        <script type="text/javascript" src="js/modernizr-1.5.min.js"></script>
        <script src="js/Chart.js"></script>
        <script src="../js/jquery-1.10.1.js"></script>
        <meta name = "viewport" content = "initial-scale = 1, user-scalable = no">
        <style>
            canvas{
            }
        </style>
        <script>
            var Jan, Fev, Mar, Abr, Mai, Jun, Jul, Ago, Set, Out, Nov, Dez;
            var data;
            $(document).ready(function() {
                $.ajax({
                    url: "GerarGrafico.php",
                    success: function(saida) {
                        data = JSON.parse(saida);
                        Jan = data.mes.janeiro;
                        Fev = data.mes.fevereiro;
                        Mar = data.mes.marco;
                        Abr = data.mes.abril;
                        Mai = data.mes.maio;
                        Jun = data.mes.junho;
                        Jul = data.mes.julho;
                        Ago = data.mes.agosto;
                        Set = data.mes.setembro;
                        Out = data.mes.outubro;
                        Nov = data.mes.novembro;
                        Dez = data.mes.dezembro;

                        function converte(Valor) {
                            if (Valor == null) {
                                return 0;
                            } else {
                                return (parseFloat(Valor.replace(",", ".")));
                            }
                        }

                        var Grafico = {
                            labels: ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"],
                            datasets: [
                                {
                                    fillColor: "rgba(151,187,205,0.5)",
                                    strokeColor: "rgba(151,187,205,1)",
                                    pointColor: "rgba(151,187,205,1)",
                                    pointStrokeColor: "#fff",
                                    data: [converte(Jan), converte(Fev), converte(Mar), converte(Abr), converte(Mai), converte(Jun), converte(Jul), converte(Ago), converte(Set), converte(Out), converte(Nov), converte(Dez)] ////AQUI SÃO OS VALORES PEGOS DO BANCO :3

                                }
                            ]

                        }

                        var MeuGrafico = new Chart(document.getElementById("canvas").getContext("2d")).Line(Grafico);
                    }
                });
            })
        </script>
    </head>

    <body>
        <div id="main">
            <header>
                <div id="header_section">	  
                    <div id="welcome">
                        <h2>AFACT</h2>
                    </div><!--close welcome-->	
                    <nav>
                        <ul id="nav">
                            <li><a href="index.php"><?= $nome ?></a></li>
                            <li><a href="meuspdfs.php">Meus PDFs</a></li>
                            <li><a href="grafico.php">Gráfico</a></li>
                            <li><a href="logout.php">Sair</a></li>
                        </ul>
                    </nav>
                </div><!--close header_section-->		
            </header>
            <div id="site_content">
                <div id="content">
                    <?php imprimeLateral() ?>
                    <div class="content_imagetext">
                        <canvas id="canvas" height="450" width="600"></canvas>           
                    </div>

                </div><!--close content-->   

            </div><!--close site_content-->  	

            <footer>
                <a href="index.html"><?= $nome ?></a> | <a href="meuspdfs.php">Meus PDFs</a> | <a href="grafico.php">Gr&aacute;fico</a>
            </footer>   

        </div><!--close main-->
    </body>
</html>
